<template>
	<view class="beijing1" style="position: relative">
		<image :src="img + state.peizhi.index_bg" mode="" style="position: absolute; z-index: 0; width: 100vw; height: 100vh"></image>
		<view class="" style="position: absolute; z-index: 1; bottom: 325rpx; left: 25rpx" @click="yan">
			<image src="/static/yanxi.png" mode="" style="width: 335rpx; height: 84rpx"></image>
		</view>
		<view class="" style="position: absolute; z-index: 1; bottom: 325rpx; right: 25rpx" @click="zhunag">
			<image src="/static/zhuangzao.png" mode="" style="width: 335rpx; height: 84rpx"></image>
		</view>
		<view class="" style="position: absolute; z-index: 1; bottom: 187rpx; left: 74rpx">
			<view class="flex" @click="dao">
				<image src="/static/ding.png" mode="" style="width: 21rpx; height: 23rpx"></image>
				<text style="margin-left: 18rpx; font-weight: 400; font-size: 24rpx; color: #ffffff">享宴地址：{{ state.peizhi.web_address }}</text>
			</view>
			<view class="flex" style="margin-top: 40rpx">
				<image src="/static/dianhua.png" mode="" style="width: 21rpx; height: 20rpx"></image>
				<text style="margin-left: 18rpx; font-weight: 400; font-size: 24rpx; color: #ffffff">联系电话： {{ state.peizhi.wx_tel }}</text>
			</view>
		</view>
		<view class="beijing"></view>
		<u-modal :show="show" @cancel="cancel" @confirm="confirm" showCancelButton cancelText="取消订单" confirmText="去支付">
			<view class="" style="width: 100%">
				<view class="center" style="font-weight: bold">提示</view>
				<view class="center" style="margin-top: 50rpx">检测到未支付订单</view>
			</view>
		</u-modal>
		<view class="activityPop">
			<u-popup :show="activityShow" @close="activityShow = false" :safeAreaInsetBottom="false" closeOnClickOverlay closeable mode="center" :round="'20rpx'">
				<view class="activityBox">
					<image src="../../static/zhang.png" class="back"></image>
					<view class="h1">
						{{info.title}}
					</view>
					<scroll-view class="h2" scroll-y>
						<u-parse :content="info.content"></u-parse>
					</scroll-view>
					<view style="padding: 0 30rpx;position: relative;z-index: 99;" @click="activityClick">
						<view class="center" style="height: 80rpx; background: #8c1608; border-radius: 35rpx; margin-top: 40rpx">
							<text style="font-weight: 400; font-size: 30rpx; color: #ffffff">立即预定</text>
						</view>
					</view>
				</view>
			</u-popup>
		</view>
	</view>
</template>

<script>
import { commonrichgetRules, getActivity, commoncommongetConfig, feastordergetUnPay, feastordercancel, clothes_ordercancel,feastordergetDetail } from '../../untils/api.js';
export default {
	data() {
		return {
			shujv: {},
			show: false,
			id: '',
			xina: '',
			activityShow:false,
			info:'',
			orderInfo:''
		};
	},
	async onLoad(ops) {
		if (ops.rou) {
			uni.navigateTo({
				url: decodeURIComponent(ops.rou)
			});
		}
		this.getActivityFun();
	},
	async onShow() {
		this.qcommoncommongetConfig();
		const data = await commonrichgetRules();
		this.$store.commit('cxieyi', data.data);
		if (!uni.getStorageSync('token')) {
			await this.$onLaunched;
			await this.qfeastordergetUnPay();
		} else {
			this.qfeastordergetUnPay();
		}
	},
	methods: {
		activityClick(){
			console.log(this.info.type)
			if(this.info.type == 1){
				uni.navigateTo({
					url:`/pagesA/yanxiyvding/yanxiyvding`
				})
			} else if(this.info.type == 2){
				uni.navigateTo({
					url:`/pagesA/zhuangzaoriqi/zhuangzaoriqi`
				})
			}
		},
		getActivityFun(){
			getActivity().then(res => {
				console.log(res);
				this.info = res.data;
				if(this.info){
					this.activityShow = true;
				} else {
					this.activityShow = false;
				}
			})
		},
		async qfeastordergetUnPay() {
			const data = await feastordergetUnPay();
			this.xina = data.data;
			console.log(this.xina)
			if (this.xina) {
				this.show = true;
			}
			feastordergetDetail({
				order_id:this.xina.order_id
			}).then(res => {
				this.orderInfo = res.data;
				console.log(this.orderInfo);
			})
		},
		cancel() {
			if (this.xina.type == 'clothes') {
				this.qclothes_ordercancel();
			}
			if (this.xina.type == 'seat') {
				this.qfeastordercancel();
			}
			this.show = false;
		},
		confirm() {
			if (this.xina.type == 'clothes') {
				uni.navigateTo({
					url: `/pagesB/zhuangzaozhifumingxi/zhuangzaozhifumingxi?id=${this.xina.order_id}`
				});
			}
			if (this.xina.type == 'seat') {
				uni.navigateTo({
					url: `/pagesB/yanxizhifumingxi/yanxizhifumingxi?order_id=${this.xina.order_id}&zuo=${JSON.stringify(this.orderInfo.seat_nos)}&category_id=${this.orderInfo.category_id}&time_str=${this.orderInfo.time_str}`
				});
			}
			this.show = false;
		},
		async qclothes_ordercancel() {
			const data = await clothes_ordercancel({
				order_id: this.xina.order_id
			});
			if (data.code == 1) {
				uni.showToast({
					icon: 'none',
					title: '订单已取消',
					duration: 2000
				});
			}
		},
		async qfeastordercancel() {
			const data = await feastordercancel({
				order_id: this.xina.order_id
			});
			if (data.code == 1) {
				uni.showToast({
					icon: 'none',
					title: '订单已取消',
					duration: 2000
				});
			}
		},
		dao() {
			uni.openLocation({
				latitude: Number(this.state.peizhi.lat),
				longitude: Number(this.state.peizhi.lng),
				success: function () {
					console.log('success');
				},
				fail: (err) => {
					console.log(err);
				}
			});
		},
		async qcommoncommongetConfig() {
			const data = await commoncommongetConfig({
				key: 'web_address,wx_tel,lat,lng,index_bg,adorn_bg,wx_qrcode'
			});
			this.$store.commit('cpeizhi', data.data);
		},
		zhunag() {
			uni.navigateTo({
				url: '/pagesA/zhuangzaoriqi/zhuangzaoriqi'
			});
		},
		yan() {
			uni.navigateTo({
				url: '/pagesA/yanxiyvding/yanxiyvding'
			});
		},
		rightClick() {
			console.log('rightClick');
		},
		leftClick() {
			console.log('leftClick');
		},
		scrolltolower() {
			console.log('到底了');
		}
	}
};
</script>

<style lang="scss" scoped>
.sl1 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 1;
}
.sl2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
}
.beijing {
	overflow: hidden;
	padding: 0 25rpx;
}
.beijing1 {
	min-height: 100vh;
	background-color: #f6f5f5;
	//系统tabbar不要加注释掉
	padding-bottom: env(safe-area-inset-bottom);
	box-sizing: border-box;
}
	.activityPop{
		/deep/ .u-popup__content{
			background: #efe7db;
		}
		.activityBox{
			width: 600rpx;
			padding-top: 25rpx;
			padding-bottom: 40rpx;
			.back{
				width: 374rpx;
				height: 640rpx;
				position: absolute;
				bottom: -208px;
				right: 0;
			}
			.h1{
				min-height: 90rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 30rpx;
				color: #222;
				border-bottom: 1px solid rgba(255,255,255,0.2);
			}
			.h2{
				padding: 30rpx;
				font-size: 28rpx;
				max-height: 50vh;
				box-sizing: border-box;
			}
		}
	}

</style>
